daiiz 複雑GUI会2 発表資料
Scrapbox
ツマミのない範囲選択UI
https://gyazo.com/b8b76c1029d8b4b97db4fb86a0580214
目的の端点付近をなぞるだけでも良く、この場合は選択範囲の近い方の端が移動してくる。
https://gyazo.com/1763fc15cba63fc894e8c3cc951c16b4
スワイプカーソル
行を左右にスワイプするとカーソルが一文字ずつ動く
狙いを定めにくい位置に近づけるときに使う
https://gyazo.com/2c352f8393801519aaa46c8c14392e8c
iOS × 物理キーボード
矢印キーの onKeyDown, onKeyUp, ... イベントが来ないがなんとかする
iPadOSではこの力技は不要になったのでめでたい
編集履歴のバー
https://gyazo.com/34f8bd5838c0e07f93b41786d1b00cc1
この2つを表している
何日前に編集されたか
その版の継続期間
合字と聞いて思い出した
SVG Screenshot
ブラウザでのスクリーンショットをSVG形式で撮る
撮影範囲内のaタグやGIF画像も保持できる
文字を選択してコピーできる
12月の技書博で本出します
Retinaディスプレイで撮影した画像を正しいサイズで表示する
https://gyazo.com/0bcc15329f8f56a89bdd326fa5aee2dc/raw
12月の技書博で本出します
SVG Drawing (開発中)
SVGとCanvasの2層構造
矩形・フリーハンドで範囲選択して、内部に含まれるpathを平行移動
Cmd+Aでの全選択
Cmd+C, Cmd+V でコピペ
https://gyazo.com/f187d10eefa73a180d1cfe282e2983b3
書き順も保持しているのでアニメーション再生できる
応用先案
文字の書き方を知る
上手い人のスケッチの描き順を学ぶ
https://gyazo.com/3e3b924da5883e8c678af0c386872e56
タイムライン? (開発中)
時系列データの見せ方を模索
粒度の異なる複数の時刻データをうまく見せたい
https://gyazo.com/55db064d6a7d6a66948e59cc35b75992
https://gyazo.com/f12610c2e9d7f92880665b4421f32582/raw
データ
code:diary1.tsv
1562952307180+1min 寝る
1562952388128+1min かなりねむい
1562952444770+1min また明日！
1562952686397+1min 予定を考えながら寝る
1562979909495+1min 起きた
1562982577013+2h コメダ珈琲、モーニングA
1562985806344+1min XML返せる
1562985808344+1min スプーン落とした
1562985906344+1min JSON返せる
1562990400000+3h プリンタを買いに
使い方
code:html
<gusuku-v1
unit="10 minutes"
names="diary,diary2,diary3"
colors="green,gold"></gusuku-v1>